<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="/WEB-INF/struts-tags.tld" prefix="s"%> 
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>喜乐康智能家居系统</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<script type="text/javascript" src="<%=basePath%>js/easyui/jquery.easyui.min.js"></script>
  	<script type="text/javascript">

  	$(function(){
  		$(".setting_scene_right_content").load(evn_Path+"setting!sceneSceneDetail.do?sceneId=0");
  	  	})
	var currentSceneId = 0;
	var leftAddDeviceId = 0;	
  	var settingSceneListCurrentPage = 1;
	function settingSceneListUp(upDown){
		 listOpenUp(settingSceneListCurrentPage,"settingSceneListCurrentPage",<s:property value="sceneList.size()"/>,5,
				 "setting_scene_left_top_list_up",
				 "up_s.png",
				 "up_press_s.png",
				 "scene_list_img_li",upDown);
	}
	
	
	function settingSceneListDown(upDown){
		listOpenDown(settingSceneListCurrentPage,"settingSceneListCurrentPage",<s:property value="sceneList.size()"/>,5,
				"setting_scene_left_top_list_down",
				"down_s.png",
				"down_press_s.png",
				"scene_list_img_li",upDown);
		
	}
	function changeSceneRoom(roomId){
		$(".setting_scene_left_bottom_list").load(evn_Path+"setting!sceneDeviceList.do?roomId="+roomId);
  	}
	function pressScene(id,sceneId){
		$(".device_use_img_li_scene").css("background-image", "url('" + evn_Path+ "resource/scene_s.png')");
		$("#scene_list_img_li"+id).css("background-image", "url('" + evn_Path+ "resource/scene_press_s.png')");
		$("#sceneName").val($("#scene_list_img_li"+id).text().trim());
		$(".setting_scene_right_content").load(evn_Path+"setting!sceneSceneDetail.do?sceneId="+sceneId);
		currentSceneId = sceneId;
	}

	function sceneAdd(upDown){
		if(upDown=='down'){
			$(".setting_scene_add").css("background-image", "url('" + evn_Path+ "resource/setting_scene_add_press.png')");
		}else if(upDown=='up'){
			$(".setting_scene_add").css("background-image", "url('" + evn_Path+ "resource/setting_scene_add.png')");
			$("#sceneName").val("");
			currentSceneId = 0;
			$(".setting_scene_right_content").load(evn_Path+"setting!sceneSceneDetail.do?sceneId=0");
		}
	}

	function sceneDelete(upDown){
		if(currentSceneId == 0){
			if(upDown=='down'){
				alert("请选择要删除的场景！");
			}
			return ;
		}
		if(upDown=='down'){
			$(".setting_scene_delete").css("background-image", "url('" + evn_Path+ "resource/setting_scene_delete_press.png')");
		}else if(upDown=='up'){
			if(confirm("你确定要删除场景吗？")){
				$.post(evn_Path+"setting!deleteScene.do",{'sceneId':currentSceneId},
							function(data){
								if(data == 'success'){
									$('.setting_background').load('setting!scene.do');
								}
							}
						)
			}
			
		}
	}
  	</script>
  	
  </head>
  
  <body>
  	<div style="height: 40px;"></div>
  	<div class="setting_scene">
  		<div class="setting_scene_left">
	  		<div class="setting_scene_left_top">
	  			<div class="setting_scene_left_top_name">
	  				<span style="float: left; line-height: 60px; font-weight: bold; font-size: 15px;">场景名称</span>
	  				<input type="text" onclick="callVK();" id="sceneName" name="sceneName" style="height: 30px; float: left; margin-left: 5px; width: 150px; line-height: 30px; margin-top: 15px;"/> 
	  				<div class="setting_scene_add" onmousedown="sceneAdd('down')" onmouseup="sceneAdd('up')"></div>
	  				<div class="setting_scene_delete" onmousedown="sceneDelete('down')" onmouseup="sceneDelete('up')"></div>
	  			</div>
	  			<div class="setting_scene_left_top_list">
	  				<div class="setting_scene_left_top_list_item">
	  					<s:iterator value="sceneList" id="scene" status="status">
	  						<div onclick="pressScene('<s:property value="#status.index+1" />','<s:property value="sceneId" />');" id="scene_list_img_li<s:property value="#status.index+1" />" class="device_use_img_li_scene"
	  							<s:if test="#status.index+1 > 5">
	  								style="display:none;"
	  							</s:if>
	  						>
								<s:property value="sceneName"/>
							</div>
	  					</s:iterator>
	  					
	  				</div>
	  				<div class="setting_scene_left_top_list_up_down">
	  					<div class="setting_scene_left_top_list_up" onmousedown="settingSceneListUp('down')" onmouseup="settingSceneListUp('up')"></div>
	  					<div class="setting_scene_left_top_list_down" onmousedown="settingSceneListDown('down')" onmouseup="settingSceneListDown('up')"></div>
	  				</div>
	  			</div>
	  		</div>
	  		<div class="setting_scene_left_bottom">
	  			<div class="setting_scene_left_bottom_name">
	  				<span style="float: left; line-height: 60px; font-weight: bold; font-size: 15px;margin-top:-15px;">选择房间</span>
	  				<select id="roomId" name="roomId" style="height: 30px; float: left; margin-left: 5px; width: 150px; line-height: 30px;font-size: 18px; " onchange="changeSceneRoom(this.value)">
						<option value="0">请选择</option>
						<s:iterator value="roomList" id="room">
							<option value="<s:property value="roomId" />"><s:property value="roomName" /></option>
						</s:iterator>
					</select>
	  				
	  			</div>
	  			<div class="setting_scene_left_bottom_list">
	  				
	  			</div>
	  			
	  		</div>
  		</div>
  		
  		<div class="setting_scene_right">
  			<div class="setting_scene_right_content">
  				
  			</div>
  			
  		</div>
  	</div>
  </body>
</html>
